const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require("clean-webpack-plugin");
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const OptmizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const LiveReloadPlugin = require('webpack-livereload-plugin');//监控浏览器自动更新
const Manifest= require('webpack-manifest');
module.exports = {
  //已多次提及的唯一入口文件 
  entry: {
    index: [
      path.join(__dirname, "./src/public/js/index.es")
    ],
    'praise-button': [
      path.join(__dirname, "./src/public/js/praise-button.es")
    ]
  },
  output: {
    
    publicPath: 'http://10.0.1.22:3000',
    //打包后的文件存放的地方 
    path: path.join(__dirname, "./build/"),
    //打包后输出文件的文件名 
    filename: "public/js/[name]-[hash:5].js"
  },
  module: {
    rules: [
      {
        test: /\.es$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['env']
          }
        }
      },
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          fallback: "style-loader",
          use: [
            {
              loader: "css-loader",
              options: {
                modules: true
              }
            }, {
              loader: "postcss-loader"
            }
          ]
        })
      }
    ]
  },
  plugins: [    
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      filename: 'public/js/vendor-[hash:5].min.js',
    }),
    new ExtractTextPlugin("public/css/praisebutton-[hash:5].css"),
    new ExtractTextPlugin("public/css/starbutton-[hash:5].css"),
    new HtmlWebpackPlugin({ // Also generate a test.html 
      filename: './views/layout.html',
      template: 'src/widget/layout.html',
      inject: false
    }),
    new HtmlWebpackPlugin({ // Also generate a test.html 
      filename: './views/index.html',
      template: 'src/views/index.js',
      inject: false,
      chunks: ['vendor', 'index', 'praise-button']
    }),
    new HtmlWebpackPlugin({ // Also generate a test.html 
      filename: './widget/index.html',
      template: 'src/widget/index.html',
      inject: false
    }),
    new HtmlWebpackPlugin({ // Also generate a test.html 
      filename: './views/star.html',
      template: 'src/views/star.js',
      inject: false,
      chunks: ['vendor', 'index', 'praise-button']
    }),
    new HtmlWebpackPlugin({ // Also generate a test.html 
      filename: './widget/star.html',
      template: 'src/widget/star.html',
      inject: false
    }),
    new Manifest({
      cache: [
        './public/css/praisebutton-[hash:5].css',
        './public/css/starbutton-[hash:5].css',
      ],
      //Add time in comments. 
      timestamp: true,
      // 生成的文件名字，选填 
      // The generated file name, optional. 
      filename:'cache.manifest', 
      // 注意*星号前面用空格隔开 
      network: [
        '*'
      ],
      // 注意中间用空格隔开 
      //fallback: ['/ /404.html'],
      // manifest 文件中添加注释 
      // Add notes to manifest file. 
      headcomment: 'test manifest file', 
      master: ['./views/layout.html']
    }),
    new LiveReloadPlugin({ appendScriptTag: true }),//将<LiveReload>的script自动加入<head>中
    new CleanWebpackPlugin('build/public/**/*.*', {
      root: __dirname,
      verbose: true,
      dry: false
    })
  ]
}


